<%@ page language="java" contentType="text/html; charset=utf-8"  pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <%@ include file="/common/pre/header.jsp" %>
  <script src="${ctx}/statics/js/backend/backend.js"></script>
</head>
<body>
<%@ include file="/common/backend/searchBar.jsp" %>
<!--End Header End-->
<div class="i_bg bg_color">
  <!--Begin 用户中心 Begin -->
  <div class="m_content">
    <%@ include file="/common/backend/leftBar.jsp"%>
    <div class="m_right" id="content">
      <div class="mem_tit">分类列表</div>
      <br>
      <table border="0" class="order_tab" style="width:930px; text-align:center; margin-bottom:30px;" cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
          <td width="5%">选择</td>
          <td width="20%">分类名称</td>
          <td width="25%">分类级别</td>
          <td width="25%">父级分类</td>
          <td width="25%" >操作</td>
        </tr>
        <c:forEach items="${page.pageList}" var="cate">
          <tr>
            <td width="5%"><input type="radio" value="${cate.id}" name="select" onclick="toUpdateProductCategoryList(this);"/></td>
            <td>${cate.name}</td>
            <td>
            <c:choose>
               <c:when test="${cate.type==1}">一级分类</c:when>
               <c:when test="${cate.type==2}">二级分类</c:when>
               <c:when test="${cate.type==3}">三级分类</c:when>
            </c:choose>
            </td>
            <td>
            <c:if test="${empty cate.parentName}">
            	无
            </c:if>
            <c:if test="${not empty cate.parentName}">
            	${cate.parentName}
            </c:if>
            </td>
            <td><a href="javascript:void(0)"  id="cate_${cate.id}" onclick="delCate(jq(this));">删除</a></td>
          </tr>
        </c:forEach>
        </tbody>
      </table>
      <p align="right"> 当前页数:[${page.pageNo}/${page.pageNum}]&nbsp; 总记录数：${page.pageCount}
        <a href="${ctx}/categoryListServlet?pageNo=1">首页</a>
        <a href="${ctx}/categoryListServlet?pageNo=${page.pageNo -1 <=1? 1:page.pageNo -1}">上一页</a>
        <a href="${ctx}/categoryListServlet?pageNo=${page.pageNo +1 >=page.pageNum?page.pageNum:page.pageNo +1}">下一页</a>
        <a href="${ctx}/categoryListServlet?pageNo=${page.pageNum}">末页</a>
      </p>
      <%@ include file="/common/pre/pagerBar.jsp" %>
      <div id="addProductCategory">
          <table border="0" class="add_tab" style="width:930px;" cellspacing="0" cellpadding="0">
            <tr>
              <td>一级分类</td>
              <td>
                <select id="cate1" onchange="cate2()">
                  <option value="0">请选择</option>
                </select>
              </td>
            </tr>
            <tr>
              <td>二级分类</td>
              <td>
                <select id="cate2">
                  <option value="0">请选择</option>
                </select>
              </td>
            </tr>
            <tr>
              <td>分类名称</td>
              <td><input type="text" name="typeName" id="typeName"/> </td>
            </tr>
          </table>
          <p align="right">
            <br>
            <a href="javascript:void(0);" onclick="addCategory()" class="add_b">添加分类</a>
          </p>
      </div>
    </div>
  </div>
  <%@ include file="/common/pre/footer.jsp" %>
</div>
<script type="text/javascript">
    function delCate(obj) {
      let id = obj.attr("id");
      let index = id.indexOf("_");
      id=id.substring(index+1);
      if (window.confirm("是否确认删除")){
        $.post("${ctx}/categoryDelServlet",{"id":id},function (data) {
          alert(data.success);
          window.location="${ctx}/categoryListServlet"
        },"json");
      }

    }

    cate1();
    function cate1() {
      $.post("${ctx}/cateServlet",{"pid":0,"type":1},function (data) {
        // alert(data);
        for (let i = 0; i < data.length ; i++) {
          var ele =data[i];
          var option1 = $("<option value='"+ele.id+"'>"+ele.name+"</option>");
          var cate1=$("#cate1");
          cate1.prepend(option1);
        }
      },"json");
    }

    function cate2() {
      let $cate1 = $("#cate1").val();
      $.post("${ctx}/cateServlet",{"pid":$cate1,"type":2},function (data) {
        // alert(data);
        var cate2=$("#cate2");
        cate2.empty();
        let $option = $("<option value=\"0\">请选择</option>");
        cate2.prepend($option);
        for (let i = 0; i < data.length ; i++) {
          var ele =data[i];
          var option2 = $("<option value='"+ele.id+"'>"+ele.name+"</option>");
          cate2.prepend(option2);
        }
      },"json");
    }
    function addCategory() {
      let cate1 = $("#cate1").val();
      let cate2 = $("#cate2").val();
      let name = $("#typeName").val();
      <%--window.location ="${ctx}/categoryAddServlet?cate1="+cate1+"&cate2="+cate2+"&name="+name;--%>
      $.post("${ctx}/categoryAddServlet",{"cate1":cate1,"cate2":cate2,"name":name},function (data) {
        alert(data.sucess);
        window.location="${ctx}/categoryListServlet"
      },"json");
    }



</script>
</body>
</html>


